<template>
  <div>
    <el-table :data="dataList" stripe style="width: 100%" border>
      <el-table-column prop="prefix_custom" label="前缀">
        <template slot-scope="scope">
          <el-input v-model="scope.row.prefix_custom" @blur="prefix_custom_change(scope.row.prefix_custom)"></el-input>
        </template>
      </el-table-column>
      <el-table-column prop="date" label="日期">
        <template slot-scope="scope">
          <el-select v-model="scope.row.date" placeholder="请选择日期" @change="date_change">
            <el-option  label="年" :value="1"></el-option>
            <el-option  label="年月" :value="2"></el-option>
            <el-option  label="年月日" :value="3"></el-option>
          </el-select>
        </template>
      </el-table-column>
      <el-table-column prop="serial_number" label="序号"> 
        <template slot-scope="scope">
        <el-input placeholder="请输入序号位数" type="number" v-model="scope.row.serial_number">
          <template slot="append">位</template>
        </el-input>
      </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import {
  getRuleSerialNumber,
  setRuleSerialNumber
} from "@/api/product/index";
export default {
  data() {
    return {
      dataList: [],
    };
  },
  mounted() {
    this.getlist();
  },
  methods: {
    getlist() {
      this.dataList=[]
      getRuleSerialNumber().then((res) => {
        if (res.code == 200) {
          this.dataList.push(res.data);
          console.log(this.dataList);
        }
      });
    },
    //前缀
    prefix_custom_change(val){
      let data={
        prefix_custom:val
      }
      setRuleSerialNumber(data).then(res=>{
          if(res.code==200){
              this.$message.success('提交成功')
              this.getlist()
          }
      })
    },
    date_change(val){
      console.log(val)
      let data={
        data:val
      }
      setRuleSerialNumber(data).then(res=>{
          if(res.code==200){
              this.$message.success('提交成功')
              this.getlist()
          }
      })
    }



  },
};
</script>

<style></style>
